import { useRef, useState } from "react"
import { Button, Flex, Modal, Collapse } from "antd"
import WssLogs from "@/pages/operation-page/parts/WssLogs"
import AutoCraftDialog from "@/pages/operation-page/parts/AutoCraftDialog"
import CraftGroupDialog from "@/pages/operation-page/parts/CraftGroupDialog"
import StartRecordDialog from "@/pages/operation-page/parts/StartRecordDialog"
import KeyboardGroupDialog from "@/pages/operation-page/parts/KeyboardGroupDialog"
import MouseClickDialog from "@/pages/operation-page/parts/MouseClickDialog"
import AutoClickImageButtonDialog from "@/pages/operation-page/parts/AutoClickImageButtonDialog"
import MissionsQuestDialog from "@/pages/operation-page/parts/MissionsQuestDialog"
import $wss from "@/services/wss.service"
import useAppStore from "@/store/useAppStore"
import environment from "@/environment"


export default function OperationPage() {
  const logRef = useRef()
  const logScrollLocked = useAppStore(state => state.logScrollLocked)
  const [showMoreOperation, setShowMoreOperation] = useState(false)
  
  return (
    <div className="page-wrap operation-page-wrap">
      <div className="action-wrap">
        <Flex gap="small" wrap>
          <Button type="primary" onClick={() => logRef.current?.clear()}>清空日志</Button>
          <Button type="primary" color={logScrollLocked ? "" : "cyan"} variant="solid" onClick={() => useAppStore.setState({logScrollLocked: !logScrollLocked})}>{logScrollLocked ? "滚动日志" : "锁定日志"}</Button>
          <Button type="primary" color={showMoreOperation ? "pink" : ""} variant="solid" onClick={() => setShowMoreOperation(!showMoreOperation)}>更多操作</Button>
        </Flex>
        <Flex gap="small" wrap>
          <CraftGroupDialog auto_mission_order onlyMissionsOrder onFinish={(payload) => $wss.startCraftGroup(payload)}>
            <Button type="primary">盟约收菜</Button>
          </CraftGroupDialog>
          <MissionsQuestDialog title="盟约任务[接]" default_record_events_file={environment.missionXnQuestJsonFile.startJson} onFinish={(payload) => $wss.startCraftGroup(payload)}>
            <Button type="primary">盟约任务[接]</Button>
          </MissionsQuestDialog>
          <MissionsQuestDialog title="盟约任务[交]" default_record_events_file={environment.missionXnQuestJsonFile.completeJson} onFinish={(payload) => $wss.startCraftGroup(payload)}>
            <Button type="primary">盟约任务[交]</Button>
          </MissionsQuestDialog>
          <CraftGroupDialog onFinish={(payload) => $wss.startCraftGroup(payload)}>
            <Button type="primary">制造集合</Button>
          </CraftGroupDialog>
          <Button type="primary" onClick={() => $wss.startAutoClickTargetImage({btn_image: "word_sell_btn.png", interval: 6})}>拍卖物品</Button>
          <Button type="primary" onClick={() => $wss.startPetBattle()}>宠物对战</Button>
          <Button type="primary" onClick={() => $wss.startPressNum1()}>按1</Button>
          <KeyboardGroupDialog onFinish={(payload) => $wss.startKeyPressList(payload)}>
            <Button type="primary">按键组合</Button>
          </KeyboardGroupDialog>
          <Button type="primary" onClick={() => $wss.resetWowClient()}>重启WOW</Button>
          <Button type="primary" onClick={() => $wss.startDebug()}>Debug</Button>
          
          <Button type="primary" onClick={() => $wss.stopAllTask()}>停止任务</Button>
        </Flex>

        {showMoreOperation && (
          <Flex gap="small" wrap>
            <StartRecordDialog onFinish={(payload) => $wss.startRecord(payload)}>
              <Button type="primary">开始录制</Button>
            </StartRecordDialog>
            
            <Button type="primary" onClick={() => $wss.stopRecord()}>停止录制</Button>
            <Button type="primary" onClick={() => $wss.playRecord()}>播放录制</Button>
            <MouseClickDialog onFinish={(payload) => $wss.startMouseClick(payload)}>
              <Button type="primary">鼠标点击</Button>
            </MouseClickDialog>
            <AutoClickImageButtonDialog
              initialValue={{btn_image: "word_sell_btn.png", interval: 1}}
              onFinish={(payload) => $wss.startAutoClickTargetImage(payload)}
            >
              <Button type="primary">点击图片</Button>
            </AutoClickImageButtonDialog>
            <AutoCraftDialog showSalvageCardOption onFinish={(payload) => $wss.startAutoCraft(payload)}>
              <Button type="primary">自动收菜</Button>
            </AutoCraftDialog>
            <AutoCraftDialog showSalvageCardOption onFinish={(payload) => $wss.startAutoOrder(payload)}>
              <Button type="primary">自动订单</Button>
            </AutoCraftDialog>
            <AutoCraftDialog onFinish={(payload) => $wss.startSalvageCard(payload)}>
              <Button type="primary">自动拆卡牌</Button>
            </AutoCraftDialog>
          </Flex>
        )}
      </div>
      <div className="log-wrap">
        <WssLogs ref={logRef}/>
      </div>
    </div>
  )
}